<template>
  <Form ref="form" :model="data" :rules="rules" :label-width="labelWidth" :label-position="labelPosition">
    <Row :gutter="24" type="flex" justify="start" style="padding:2px 5px;">
      <Col v-for="(item,index) in columns" :key="index" :span="24/cols">
        <FormItem :label="item.title" :prop="item.key">
          <field-cell :config="item.config" v-model="data[item.key]"></field-cell>
          <Button type="primary" @click="$emit('selectBtn')">{{lang.select}}</Button>
        </FormItem>
      </Col>
    </Row>
  </Form>
</template>

<script>
    import fieldCell from 'public/components/basic/fieldCell.vue'
    export default {
        name: 'form-select',
        components: { fieldCell },
        data () {
            return {
            }
        },
        props: {
            labelWidth: {
                default: () => {
                    return 100;
                }
            },
            labelPosition: {
                default: () => {
                    return 'right';
                }
            },
            cols: {
                default: () => {
                    return 2;
                }
            },
            columns: {
                default: () => {
                    return [];
                }
            },
            data: {
                default: () => {
                    return {};
                }
            },
            rules: {
                default: () => {
                    return {};
                }
            }
        },
        computed: {
            lang () {
                return {
                    'en-US': {
                        'select': 'select'
                    },
                    'zh-CN': {
                        'select': '选择'
                    }
                }[this.G_Locale]
            }
        }
    }
</script>

<style lang="scss" scoped>

</style>
